<template>
  <div class="shared">
    <!-- 基础信息 -->
    <div class="shared-basic">
      <a-card 
      title="基础信息" 
      :bordered="false" 
      style="width: 100%"
      >
        <span slot="extra" style="cursor:pointer;color:#358CF0;position:absolute;top:18px;left:120px">
          修改<a-icon type="edit" />
        </span>
        <div class="info">
          <div><span>账户类型</span> {{merchantInfo.business_type}}</div>
          <div><span>实名认证</span> 已认证</div>
          <div><span>账号名称</span> {{merchantInfo.store_name}}</div>
          <div><span>公司全称</span> {{merchantInfo.store_full_name}}</div>
          <div><span>公司简称</span> {{merchantInfo.store_short_name}}</div>
          <div><span>公司地址</span> {{merchantInfo.address}}</div>
          <div><span>联系人姓名</span> {{merchantInfo.username}}</div>
          <div><span>联系人手机</span> {{merchantInfo.phone}}</div>
          <div style="margin:0"><span>联系人邮箱</span> {{merchantInfo.email}}</div>
        </div>
      </a-card>
    </div>
    <!-- 基础信息 -->
    <div class="shared-role">
      <a-card 
      title="角色身份" 
      :bordered="false" 
      style="width: 100%"
      >
        <div class="info">
          <div><span>PID</span> 2088421609886161</div>
          <div style="margin:0"><span>合作伙伴角色</span> 商户</div>
        </div>
      </a-card>
    </div>
  </div>
</template>
<script>
import { apiMerchantInfo } from '@/utils/api'
export default {
  data() {
    return {
      // 商户信息
      merchantInfo: {}
    }
  },
  mounted() {
    this.getMerchantInfo();
  },
  methods: {
    // 获取商户信息
    getMerchantInfo() {
      let token = sessionStorage.getItem('token')
      apiMerchantInfo(token).then(res => {
        if(res.code === 10000) {
          this.merchantInfo = res.data;
          // window.console.log('shanghu', res.data)
        }
      }).catch(err => {
        window.console.log('err', err)
      })
    }
  }
}
</script>
<style lang="less" scoped>
.shared {
  &-basic, &-role{
    .info {
      font-size: 14px;
      div {
        margin-bottom: 20px;
        color: #333333;
        span {
          display: inline-block;
          width: 100px;
          color: #666666;
          // border: 1px solid red;
        }
      }
    }
  }
  &-role {
    margin-top: 10px;
  }
}
</style>